<template>
	<el-dialog v-model="visible" :destroy-on-close="true" :width="800" top="5" :title="`${dialogData.title}参数`">
		<el-form ref="ruleFormRef" :rules="rules" :disabled="dialogData.isView" :model="formData" label-width="100px">
			<el-row>
				<el-col :span="12">
					<el-form-item label="参数名称" prop="name" clearable>
						<el-input v-model="formData!.name" placeholder="请输入参数名称"></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="参数编码" prop="code" clearable>
						<el-input v-model="formData!.code" placeholder="请输入参数编码"></el-input>
					</el-form-item>
				</el-col>
			</el-row>
			<el-row>
				<el-col :span="12">
					<el-form-item label="参数值" prop="value" clearable>
						<el-input v-model="formData!.value" placeholder="请输入参数值"></el-input>
					</el-form-item>
				</el-col>
			</el-row>
            <el-row>
                <el-col :span="24">
					<el-form-item label="备注" prop="remark" clearable>
						<el-input type="textarea" :rows="2" v-model="formData!.remark" placeholder="请输入备注信息"></el-input>
					</el-form-item>
				</el-col>
			</el-row>
		</el-form>
		<template #footer>
			<el-button @click="visible = false">取消</el-button>
			<el-button type="primary" v-show="!dialogData.isView" @click="handleSubmit">确定</el-button>
		</template>
	</el-dialog>
</template>

<script setup lang="ts" name="UserDialog">
import { ref, reactive } from 'vue';
import { ElMessage, FormInstance, FormRules, ElMessageBox } from 'element-plus';
import { useModal } from '/@/hooks/useModal';
import rulesObj from './rules';

//验证规则
const rules = reactive<FormRules>(rulesObj);

const formData = reactive<any>({
    name: '',
    code: '',
    value: '',
    remark: '',
	dataStatus: 1
});

const ruleFormRef = ref<FormInstance>();
const { visible, acceptParams, handleSubmit, dialogData } = useModal(formData, ruleFormRef)

defineExpose({
	acceptParams,
});
</script>
